<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>QKD管理系统</title>
<link rel="stylesheet" type="text/css" href="css/app.css" />
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=qDskVhcwOWM0r8HkgzbFAyujdQOusgGd"></script>
<script src="js/jquery.min.js"></script>
<script src="js/vue.min.js"></script>
</head>
<body>
<div class="main">
<div class="logo">
<img src="img/logo.png">
<span>量子保密通信系统--密钥分发终端管理系统</span>
</div>
<div class="content">
<!-- 左边 -->
<div class="main-left" id="cmm9801">
<div class="user">
<ul>
<li>&nbsp;</li>
<li>用户:{{user.userName}}</li>
<li>角色:{{user.role}}</li>
<!-- <li>ID:{{user.id}}</li> -->
</ul>
</div>
<!-- 表格 -->
<div class="sysinfo">
<p>登录时间:{{loginTime}}</p>
</div>
<!-- 左下 -->
<div class="deviceinfo">
<p id="p1"><strong>设备状态概览</strong></p>
<p id="p2">设备属性:发送端</p>
<p id="p2">运行状态:正常</p>
<p id="p3">设备时间:{{curtime}}</p>
<p id="p3">运行时间:{{runtimeText}}</p>
</div>
</div>
<!-- 四张图片 -->
<div class="main-middle">
<ul>
<li>
<img src="img/b-1.png">
<a href="sbxx.html">
<h4>设备信息</h4>
<h4>System information</h4>
</a>
</li>
<li>
<img src="img/b-2.png">
<a href="javascript:;">
<h4>设备管理</h4>
<h4>Device management</h4>
</a>
</li>
<li>
<img src="img/b-3.png">
<a href="sbsz.html">
<h4>设备设置</h4>
<h4>Device Settings</h4>
</a>
</li>
<li>
<img src="img/b-4.png">
<a href="jmkz.html">
<h4>加密控制</h4>
<h4>Encrypt Control</h4>
</a>
</li>
</ul>
</div>
<!-- 右边地图 -->
<div class="main-right">
<div id="allmap">
</div>
</div>
</div>
</div>
</body>
</html>
<script type="text/javascript">
$(document).ready(function() {
		//检查是否登陆,如果未登陆跳转到登陆界面.
		var isLogin = sessionStorage.getItem("isLogin");
		if (isLogin != 'true') {
		window.location.href = "index.html";
		return;
		}
		var data = {
optype: "main_load"
};

$.ajax({
url: "main_load.action",
data: data,
dataType: "json",
success: function(result) {
if (result.login == 'false') {
sessionStorage.setItem('isLogin', 'false');
parent.location = 'index.html';
return;
}
active(result);
}
});
});

function active(data) {
	var vm = new Vue({
el: '#cmm9801',
data: data,
computed: {
//计算时间
runtimeText: function() {
var seconds = this.uptime;
var day = parseInt(seconds / 60 / 60 / 24);
var hour = parseInt(seconds % (60 * 60 * 24) / 60 / 60);
var min = parseInt(seconds % (60 * 60) / 60);
var sec = seconds % 60;
return day + "天" + hour + "小时" + min + "分" + sec + "秒";
}
}
});
}
</script>
<script type="text/javascript">
var map = new BMap.Map("allmap");
var point = new BMap.Point(107.10, 29.95);
map.enableScrollWheelZoom(true);
map.centerAndZoom(point, 12);

var geolocation = new BMap.Geolocation();
geolocation.getCurrentPosition(function(r) {
		if (this.getStatus() == BMAP_STATUS_SUCCESS) {
		var mk = new BMap.Marker(r.point);
		map.addOverlay(mk);
		map.panTo(r.point);
		} else {
		alert('failed' + this.getStatus());
		}
		});
</script>
